<template>
    <div>
        <!--表格数据-->
        <el-table :data="tableData" style="width: 100%" :header-cell-style="{background:'#eef1f6',color:'#606266'}" v-loading="loading">
            <el-table-column
                    label="宝宝姓名">
                <template slot-scope="scope">
                    <span>{{ scope.row.baby_name ? scope.row.baby_name : '-' }}</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="手机号码">
                <template slot-scope="scope">
                    <span>{{ scope.row.mother_mobile ? scope.row.mother_mobile : '-' }}</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="课包规格">
                <template slot-scope="scope">
                    <span>{{ scope.row.class_num }}/{{ scope.row.price }}元</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="赠课/换课/特批">
                <template slot-scope="scope">
                    <span>{{ scope.row.common_give }}+{{ scope.row.sign_gift_give_num }}+{{ scope.row.principal_give }}</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="顾问">
                <template slot-scope="scope">
                    <span>{{ scope.row.counselor_name }}</span>
                </template>
            </el-table-column>
            <el-table-column
                    label="操作时间">
                <template slot-scope="scope">
                    <span>{{ scope.row.create_time }}</span>
                </template>
            </el-table-column>
            <el-table-column label="操作" width="340">
                <template slot-scope="scope">
                    <el-button
                            size="mini"
                            @click="handleDetail(scope.$index, scope.row)">详情</el-button>
                    <el-button
                            size="mini"
                            type="info"
                            :disabled="activeName==='one' || activeName==='two' || activeName==='six'"
                            @click="handlePreview(scope.$index, scope.row)"
                            class="preview">合同预览</el-button>
                    <el-button
                            size="mini"
                            type="primary"
                            :disabled="activeName !=='four'"
                            @click="handleAudit(scope.$index, scope.row)">点击审核</el-button>
                    <el-button
                            size="mini"
                            type="danger"
                            :disabled="activeName==='five' || activeName==='six'"
                            @click="handleCancellation(scope.$index, scope.row)">作废</el-button>
<!--                    :disabled="activeName==='four' || activeName==='six'"-->
<!--                    <el-button-->
<!--                            size="mini"-->
<!--                            type="danger"-->
<!--                            :disabled="activeName==='four'"-->
<!--                            @click="handleBack(scope.$index, scope.row)">退款</el-button>-->
                </template>
            </el-table-column>
        </el-table>

    </div>
</template>

<script>
    export default {
        name: "sign-table",
        data() {
            return {

            }
        },
        props: {
            // 表格数据
            tableData: {
                type: Array,
            },
            // 当前tab选项
            activeName: {
                type: String,
            },
            loading: {
                type: Boolean,
                default: false
            }
        },
        methods: {
            // 详情
            handleDetail(index, row) {
                this.$emit('getDetail', row)
            },
            // 预览
            async handlePreview(index, row) {
                this.$emit('preview', row)
            },
            // 作废
            handleCancellation(index, row) {
                this.$emit('cancel',row)
            },
            // 审核
            handleAudit(index, row) {
                this.$emit('audit',row)
            }
        },
    }
</script>

<style scoped lang="scss">
    .cell {
        .preview {
            background-color: #00497f;
            border-color: #00497f;
        }
    }
</style>
